<template>
  <div>
    
    <Group class="sender">
        <cell title="在线寄快递" :link="{path:'/Sender'}"  >
          <img slot="icon" width="15" style="display:block;margin-right:5px;" src="../assets/img/iconJi.png">
        </cell>
        <cell title="在线寄快递" :link="{path:'/Sender'}"   class="lineOut">
          <img slot="icon" width="15" style="display:block;margin-right:5px;" src="../assets/img/iconSou.png">
        </cell>
    </Group >
    <Group class="exrpssSelect">    
      <cell title="快递公司选择" :link="{path:'/ExprssSelect'}"  >
        </cell>
    </Group>
    <Group class="sendSite">    
      <cell title="寄件站点" :link="{path:'/Sites'}"  >
        </cell>
    </Group>
    <Group class="payAction">
      <popup-radio title="付费方式" :options="options1" v-model="option1"></popup-radio>
    </Group>
    <Group class="sendSite">    
      <cell title="寄件站点"   >
        <span v-for="(item,$index) in weightList "  class="weightListItem" @click="selectWeight($index,item)" :class="[isshow===$index?'weightListItemOn':'']">{{item}}</span>  
        </cell>
    </Group>
    <Group class="goodsWeight">    
      <cell title="物品重量(kg)"   >
        <span class="add item" @click="add">+</span>
        <span class="num item">{{goodsWeightNum}}</span>
        <span class="reduce item" @click="reduce">-</span>
        </cell>
    </Group>
    <group class="beizhu">
        <x-textarea title="备注" v-model="beizhuText"></x-textarea>
    </group>
    <checklist :options="commonList" v-model="checklist002"  class="terms"></checklist>
    <div class="indexPage">
      <div class="left">
        预估: <span>${{newPirce}}</span>
      </div>
      <div class="right" @click="payAction">下单</div>
    </div>  
  </div>
</template>

<script>
import { Group, Cell,Radio ,PopupRadio,TabItem,XTextarea,Checklist} from 'vux'
export default {
  components: {
    Group,
    Cell,
    Radio,
    PopupRadio,
    TabItem,
    XTextarea,
    Checklist
  },
  data () {
    return {
      option1: '寄付',
      options1: ['寄付', '到付'],
      weightList:['文件','小件','大件','其他'],
      isshow:-1,
      weight:'',
      goodsWeightNum:1,
      beizhuText:'',
      checklist002:[],
      commonList:['同意《寄件服务条款》'],
      price:'12.00'
    }
  },
  methods:{
    change(value){
      console.log(value)
    },
    selectWeight($index,item){
      this.isshow =$index;
      this.weight = item;
      console.log(this.weight)
    },
    add(){
      this.goodsWeightNum+=1;
    },
    reduce(){
      if(this.goodsWeightNum<=1){
        return false;
      }else{
        this.goodsWeightNum-=1;
      }
    },
    payAction(){
      // console.log(1)
      this.$router.push({path:'/Order'})
    }
  },
  computed:{
    newPirce(){
      return this.price
    }
  }
}
</script>
